<template>
  <view class="biz-container">
    <view
      class="table-container"
      :class="{
        'table-container--with-left-tree': hasLeftTree,
        'table-container--notwith-left-tree': !hasLeftTree,
        ...getClassObjInBizTemplateCrudContainerWhenRender('table'),
      }"
    >
      <slot v-if="canvasRenderConfig.enable && canvasRenderPickedComp.targetSuffix === ''" name="canvasRender" />
      <gd-enhance-hack-dynmic-comp
        :component-file-path="tableCommonAttr.componentFilePath"
        :root-path-type="'customize'"
        :component-props="{
          props,
          curBindVal: '',
          searchFormCommonAttr,
          searchFormItemMetaList,
          searchFormData,
          tableCommonAttr,
          tableColMetaList,
          tableBodyData,
          toolBarConfig,
          operationBtnsConfig,
          allBtnsEmitFormItemMetaConfig,
          searchFormItemDynmicConfigList,
          dialogFormItemDynmicConfigList,
          tableColumnDynmicConfigList,
          tableLoading,
        }"
        v-bind="$attrs"
      ></gd-enhance-hack-dynmic-comp>
    </view>
  </view>
</template>
<script>
  export default {
    name: "BizCustomizeSimple",
    inheritAttrs: false,
  };
</script>
<script setup>
  import {
    ref,
    reactive,
    shallowRef,
    shallowReactive,
    computed,
    getCurrentInstance,
    toRefs,
    watch,
    provide,
    onMounted,
  } from "vue";
  import SceneContainerTableForm from "@gd-accbuild-ui/scene-container/scene-container-table-form/scene-container-table-form.vue";
  import SceneContainerTree from "@gd-accbuild-ui/scene-container/scene-container-tree/scene-container-tree.vue";
  import { globalConfig } from "@gd-accbuild-core/config";

  // scene-container-gen:start
  import useGetCurUiTemplateInfo from "@gd-accbuild-core/hooks/useGetCurUiTemplateInfo";
  import useCanvasRender from "@gd-accbuild-ui/biz-ui/hooks/useCanvasRender/useCanvasRender";
  import buildInBizTemplateProps from "@gd-accbuild-core/hooks/buildInBizTemplateProps";
  import useMergeMeta from "@gd-accbuild-core/hooks/useMergeMeta";
  import globalStyles from "@gd-accbuild-core/theme-chalk/pc-admin/js.module.scss";
  import { useStore } from "@gd-accbuild-core/store/hackVueStore";
  const _store = useStore();
  const { proxy: vm } = getCurrentInstance();

  const props = defineProps({
    ...buildInBizTemplateProps,
  });
  const {
    crudServiceVmTemplateConfig,
    isUseStaticResource,
    setterCrudServiceVmTemplateConfig,
    allBtnsEmitFormItemMetaConfig,
    filter_allBtnsEmitFormItemMetaConfig,
    ////
    operationBtnsConfig,
    toolBarConfig,
    setterAllTableBtnsConfig,
    filter_toolBarConfig,
    filter_operationBtnsConfig,
    filter_setterAllTableBtnsConfig,
    ////
    filter_tableCommonAttr,
    filter_tableBodyData,
    filter_dialogFormItemDynmicConfigList,
    filter_setterRemoteTableConfig,
    filter_getFirstItemAppendReqParamsIntoSearchForm,
    ////
    tableCommonAttr,
    tableColMetaList,
    tableColumnDynmicConfigList,
    tableBodyData,
    dialogFormItemDynmicConfigList,
    setterRemoteTableConfig,
    ////
    searchFormItemMetaList,
    searchFormItemDynmicConfigList,
    searchFormCommonAttr,
    searchFormData,
    setterRemoteSearchFormConfig,
    /////
    ////////
    fillFieldsIntoAddForm,
    appendFieldsIntoSearchForm,
    tablePageReq,
  } = useMergeMeta({ props });
  /////////////////////

  const {
    isDesigner,
    templateContainerAttr,
    setterTemplateContainerAttr,
    getClassObjInBizTemplateCrudContainerWhenRender,
    canvasRenderPickedComp,
    ////////////
  } = useCanvasRender({
    props,
    curTemplateAllCrudContainerKeys: ["table"],//, "tree"
    crudServiceVmTemplateConfig,
  });
  /**
   * 所有按钮引发的表单元数据配置:metaList
   */

  /////树相关

  const hasLeftTree = ref(false);
  const treeLoading = ref(true);
  const tableLoading = ref(true);
  ///////////////////
  //组件增删改查接口的附加参数,用于设计器渲染请求 是否转发到优速搭服务器
  const initMetaAndData = ({ allOverrideParams = [{ templateInnerSearchPath: "", appendReqParams: {} }] }) => {
    treeLoading.value = true;
    tableLoading.value = true;
    const appendReqParams =
      Array.isArray(allOverrideParams) && allOverrideParams.length === 1
        ? allOverrideParams[0]?.appendReqParams ?? {}
        : {};

    useGetCurUiTemplateInfo({
      templateName: vm.$options.name,
      templateIdx: props.templateIdx,
      templateInnerSearchPath: "templateProps.filter_tableCommonAttr",
      isUseStaticResource: isUseStaticResource.value,
      staticResource: props.staticResource,
      appendReqParams,
      allOverrideParams,
      store: _store,
    })
      .then((templateState) => {
        const hasTree = !templateState.hasOwnProperty("vaildFailureTemplateInnerSearchPath");
        const appendReqParams = {};
        if (hasTree) {
          //////////////////////
          setterCrudServiceVmTemplateConfig("tree", templateState);
          //////////////////////

          filter_setterRemoteTableConfig(templateState);

          filter_setterAllTableBtnsConfig(templateState);
          //////////////////////
          filter_getFirstItemAppendReqParamsIntoSearchForm(appendReqParams);
          treeLoading.value = false;
          hasLeftTree.value = hasTree;
        }
        /* 传递后面一个Promise链需要的参数 */
        return Promise.resolve({
          store: templateState.store,
          appendReqParams,
        });
      })
      .then(async (res) => {
        const templateState = await useGetCurUiTemplateInfo({
          templateName: vm.$options.name,
          templateIdx: props.templateIdx,
          store: res.store,
          isUseStaticResource: isUseStaticResource.value,
          staticResource: props.staticResource,
          appendReqParams: res.appendReqParams,
        });
        //console.log(templateState, "当前模板状态===========");
        ////////////////////////
        setterCrudServiceVmTemplateConfig("table", templateState);
        ///////////////////////
        //console.log("请求的页面模板数据====", templateState);
        /////////设置模板容器尺寸：设计时、运行时
        setterTemplateContainerAttr(templateState);
        /////////////////////////
        setterRemoteTableConfig(templateState);
        ////////////////
        setterRemoteSearchFormConfig(templateState);
        setterAllTableBtnsConfig(templateState);

        tableLoading.value = false;
      })
      .catch((err) => {
        console.log(err);
      });
  };

  initMetaAndData({
    allOverrideParams: [{ templateInnerSearchPath: "", appendReqParams: {} }],
  });

  /////////
  provide("crudServiceVmTemplateConfig", crudServiceVmTemplateConfig);
  /** 以下两个是左树点击后传给右表的参数,需要在左树点击时间内赋值 */
  provide("fillFieldsIntoAddForm", fillFieldsIntoAddForm);
  provide("appendFieldsIntoSearchForm", appendFieldsIntoSearchForm);
  provide("tablePageReq", tablePageReq);
  const sceneTreeRef = ref(null);
  const tableRef = ref(null);

  // scene-container-gen:end

  const refreshCompMetaDataProxy = computed(() => {
    return tableRef.value.refreshTableMetaData;
  });

  const table_bizVariantConfig = useSkeletonDynmicTableSize({
    toolBarConfig: toolBarConfig,
    searchFormItemMetaList: searchFormItemMetaList.value,
    tableCommonAttr: tableCommonAttr.value,
  });
  defineExpose({
    // scene-container-expose:start
    //······
    //以下为优速搭系统暴露的变量
    filter_tableBodyData,
    refreshCompMetaDataProxy,
    initMetaAndData,
    // scene-container-expose:end
  });
</script>
<style lang="scss" scoped src="../../../hooks/useCanvasRender/useCanvasRender.scss"></style>
<style lang="scss" scoped>
  .biz-container {
    width: 100%;
    height: 100%;
    display: flex;
  }

  .tree-container {
    //display:flex;
    width: calc(#{$--accbuild-tree-default-width} - #{$--accbuild-default-container-gutter});
    height: 100%;
    //height: calc(100vh - #{$--accbuild-page-top-window-container-height} - #{$--accbuild-page-tags-container-height} - 2 * #{$--accbuild-default-container-gutter});
    margin-right: #{$--accbuild-default-container-gutter};
  }

  .table-container {
    flex-grow: 1;
    min-width: 0;
    word-break: break-all;
    //width: calc(v-bind("templateContainerAttr.width"));// - (2 * #{$--accbuild-default-container-gutter})
  }

  .table-container.table-container--with-left-tree {
    width: calc(
      v-bind("templateContainerAttr.width") - #{$--accbuild-tree-default-width} - 2 * #{$--accbuild-default-container-gutter}
    );
  }

  .table-container.table-container--notwith-left-tree {
    width: calc(v-bind("templateContainerAttr.width") - 2 * #{$--accbuild-default-container-gutter});
  }
</style>
